<template>
<div class="schoollist">
    <table border="1" cellpadding='0' cellspacing='0' v-if="a%2!=0">
     <thead>
      <tr>
        <th>学校名称</th>
        <th>学生人数</th>
        <th>硕士人数</th>
        <th>博士人数</th>
        <th>教师人数</th>
        <th>note</th>
        <th>(本硕博)总人数</th>
       </tr> 
    </thead>   
    <tbody >
    <tr v-for="(item,index) of school" :key="index" >
        <td>{{item.school}}</td>
        <td>{{item.UnderGraduate}}</td>
        <td>{{item.Master}}</td>
        <td>{{item.Dr}}</td>
        <td>{{item.Teach}}</td>
        <td>{{item.notes}}</td>
        <td>{{item.person}}</td>
    </tr>
    </tbody>
    </table>
    <table border="1" cellpadding='0' cellspacing='0' v-if="b== true">
    <thead>
      <tr>
        <th>学校名称</th>
        <th>学生人数</th>
        <th>硕士人数</th>
        <th>博士人数</th>
        <th>教师人数</th>
        <th>note</th>
        <th>(本硕博)总人数</th>
       </tr> 
    </thead> 
    <tbody>
        <th v-for="(item,index) in fillschool" :key="index">
            <td>{{item.school}}</td>
            <td>{{item.UnderGraduate}}</td>
            <td>{{item.Master}}</td>
            <td>{{item.Dr}}</td>
            <td>{{item.Teach}}</td>
            <td>{{item.notes}}</td>
            <td>{{item.person}}</td>
        </th>
        </tbody>  
    </table>
    <aside>
     <button @click="chaxun()">查询</button>   
    <button @click="back()">还原</button>
    <button  @click="paixu()">排序功能</button>
    <aside>
        <input type="text" placeholder="请输入学校名称" v-model="sname">
        <button @click="search()">搜索</button>
    </aside>
    
        

    </aside>
</div>    
</template>

<script>
export default {
data(){
    return{
        a:0,
        b : false,
        sname:'',
        person:'',
        fillschool:[],
         school : [
  { school : '北京大学', UnderGraduate : 16628, Master : 16980, Dr : 14979, Teach : 3804, notes : '' ,id:1 },
  { school : '清华大学', UnderGraduate : 16291, Master : 22657, Dr : 21671, Teach : 3860, notes : '',id:2 },
  { school : '复旦大学', UnderGraduate : 15164, Master : 36690, Dr : 36690, Teach : 3602, notes : '',id:3 },
  { school : '上海交通大学', UnderGraduate : 18004, Master : 28439, Dr : 28439, Teach : 3887, notes : '学生数仅含全日制' ,id:4},
  { school : '浙江大学', UnderGraduate : 29014, Master : 28058, Dr : 18436, Teach : 4605, notes : '',id:5 },
  { school : '中国科学技术大学', UnderGraduate : 8006, Master : 19792, Dr : 12213, Teach : 2264, notes : '',id:6 },
  { school : '南京大学', UnderGraduate : 15448, Master : 19066, Dr : 16269, Teach : 'N/A', notes : '',id:7 },
  { school : '哈尔滨工业大学', UnderGraduate : 31181, Master : 16296, Dr : 9224, Teach : 4120, notes : '' ,id:8},
  { school : '西安交通大学', UnderGraduate : 24051, Master : 22587, Dr : 9337, Teach : 3772, notes : '' ,id:9},
  { school : '中国科学院大学', UnderGraduate : 1662, Master : 32106, Dr : 31262, Teach : 3311, notes : '' ,id:10},
  { school : '中国人民大学', UnderGraduate : 11678, Master : 11088, Dr : 5154, Teach : 1962, notes : '学生数仅含全日制' ,id:11},
  { school : '同济大学', UnderGraduate : 18272, Master : 18798, Dr : 9566, Teach : 2797, notes : '《2024统计公报》提取' ,id:12},
  { school : '华东师范大学', UnderGraduate : 115903, Master : 17153, Dr : 4114, Teach : 2358, notes : '学生数仅含全日制' ,id:13},
  { school : '中山大学', UnderGraduate : 33329, Master : 24138, Dr : 10718, Teach : 4619, notes : '' ,id:14},
  { school : '华南理工大学', UnderGraduate : 27757, Master : 18476, Dr : 5289, Teach : 2606, notes : '' ,id:15},
  { school : '华中科技大学', UnderGraduate : 29742, Master : 23337, Dr : 11651, Teach : 3727, notes : '' ,id:16},
  { school : '南开大学', UnderGraduate : 17305, Master : 11772, Dr : 5559, Teach : 2291, notes : '学生数仅含全日制' ,id:17},
  { school : '天津大学', UnderGraduate : 18955, Master : 13707, Dr : 5822, Teach : 'N/A', notes : '学生数仅含全日制' ,id:18},
  { school : '中南大学', UnderGraduate : 35385, Master : 16266, Dr : 8667, Teach : 'N/A', notes : '学生数仅含全日制' ,id:19},
  { school : '湖南大学', UnderGraduate : 22699, Master : 11110, Dr : 5409, Teach : 'N/A', notes : '学生数仅含全日制' ,id:20},
  { school : '东南大学', UnderGraduate : 16931, Master : 23289, Dr : 23289, Teach : 3371, notes : 'N/A' ,id:21},
  { school : '北京航空航天大学', UnderGraduate : 16522, Master : 23985, Dr : 23985, Teach : 3055, notes : '' ,id:22},
  { school : '北京理工大学', UnderGraduate : 15212, Master : 12920, Dr : 7426, Teach : 2688, notes : '学生数仅含全日制' ,id:23},
  { school : '北京师范大学', UnderGraduate : 16628, Master : 16980, Dr : 14979, Teach : 3804, notes : '' ,id:24},
  ]  
  }
    
},
computed:{
   
    
    // 过滤函数fillter:设置一个过滤条件，如果符合的数据存储到新数组内
    // let result = user.filter(item =>{
    //     // return 出过滤的条件（判断条件）
    //     return item.username == this.username && item.pwd ==this.pwd
    // });
},
methods:{
    chaxun(){
        this.a++;
    },
    paixu(){
        this.school.forEach(item => {
            item.person= Number(item.UnderGraduate)+Number(item.Master)+Number(item.Dr);
            // console.log(Number(item.person));
            return this.school.sort((a,b)=>b.person-a.person);
        });
    },
    back(){
        this.school.forEach(item => {
            item.id;
            return this.school.sort((a,b)=>a.id-b.id);
        });
    },
    search(){
        if (this.sname) {
            this.b = true;
            this.fillschool = this.school.filter(item=>{
                return item.school==this.sname;
            })
            console.log(this.school);
        }
    }
}
}
</script>

<style scoped>
.schoollist {
    display: flex;
    flex-direction: column;
    justify-content: center;
    
}
.schoollist aside{
    display: flex;
    justify-content: space-between;
}
.schoollist aside button{
    width: 6rem;
    line-height: 40px;
    border: 0;
    border-radius: 8px;
}
.schoollist aside input{
    line-height: 40px;
    border: 0;
    border-radius: 8px;
}
</style>